import React,{ Component } from 'react';
import { 
	StyleSheet, 
	View, 
	Text, 
	Image,
	FlatList,
	TouchableOpacity 
} from 'react-native';
import { HeaderDatepicker } from '../../common';
import Picker from 'react-native-picker';
import TrackTabPage from './TrackTabPage';
import NavigationService from '../../common/NavigationService';
	
class HeaderLeft extends Component{
	render(){
		return (<TouchableOpacity
				onPress={()=>this.props.goBack()}
			>
			<Image
				style={styles.topLeftImg}
				source={require('../../assets/images/back_icon.png')}
			/>
		</TouchableOpacity>)
	}
}

export default class TrackIndex extends Component{
	state = {
		reportList:[]
	}
	static navigationOptions = ({navigation,navigationOptions})=>{
		return {
			title:"策略跟踪",
			//headerTitle:<HeaderDatepicker />,
			headerStyle:{
				...navigationOptions.headerStyle,
				backgroundColor:"#f54545",
			},
			headerTitleStyle:{
				fontSize:18,
				flex:1,
				textAlign:'center',
				color:"#fff"
			},
			headerLeft:<HeaderLeft goBack={()=>NavigationService.navigate("TopBottom")} />,
			headerRight: <View></View>
		}
	}

	componentDidMount(){
		
	}

	render(){
		return(
			<View style={styles.container}>
				<TrackTabPage />
			</View>
		)
	}
}

const styles = StyleSheet.create({
	container : {
		flex : 1,
		backgroundColor:'#f5f5f5'
	},
	textColor:{
		color:'#f00'
	},
	topLeftWraper:{
		flex:1,
		flexDirection:'row',
		justifyContent:'center',
		alignItems:'center'
	},
	topLeftImg:{
		width:22,
		height:22,
		marginLeft:10
	},
	topLeftTxt:{
		color:'#fff',
		fontSize:16,
		marginLeft:5
	},
	topRightImg:{
		width:22,
		height:22,
		marginRight:10
	},
	reportCellWrap:{
		backgroundColor:"#fff",
		marginTop:8
	},
	reportHeaderWrap:{
		flex:1,
		flexDirection:'row',
		alignItems:"center",
		padding:10,
		borderBottomWidth:1,
		borderBottomColor:"#f7f7f7"
	},
	reportHeaderTitle:{
		flex:1,
		flexDirection:'row',
		alignItems:"center"
	},
	reportHeaderImg:{
		width:16,
		height:18,
		marginRight:5
	},
	reportHeaderTxt:{
		fontSize:14
	},
	reportHeaderRightIcon:{
		width:16,
		height:18
	},
	reportCellContentWrap:{
		flex:1,
		justifyContent:"center",
		marginTop:20,
		marginBottom:20
	},
	reportContentTopTxt:{
		textAlign:"center",
		fontSize:14
	},
	reportContentTotal:{
		textAlign:"center",
		fontSize:26,
		color:"#f54545",
		marginTop:10,
		marginBottom:10
	},
	reportContentUnit:{
		fontSize:12,
		fontWeight:"bold"
	},
	reportContentBottomWrap:{
		flex:1,
		flexDirection:"row",
		justifyContent:"center"
	},
	reportContentBottomTxt:{
		fontSize:14,
		marginRight:10,
		marginLeft:10
	}
})